<template>
    <div class="com-cnt">
        <ul>
            <li>头像</li>
            <li>手机号码</li>
            <li>加入日期</li>
        </ul>
        <ul v-for="item in list">
            <li>
                <span class="headimg"><img :src="item.photo" alt="头像"></span>
            </li>
            <li>{{item.phone}}</li>
            <li>{{item.time}}</li>
        </ul>
        <div class="hadbottom">已到底部~</div>
    </div>
</template>

<script>
import axios from 'axios'
import http from "@/assets/js/axios"
import https from "@/assets/js/axiosh"
import { domain } from '@/assets/js/config'
import { domains } from '@/assets/js/config'
import Qs from 'qs'
import { maskTips, maskCallback } from '@/assets/js/dom'
import $ from 'jquery'
export default {
    data() {
        return {
            list: ''
        }
    },
    components: {

    },
    mounted: function () {
        this.getVipList()
    },
    methods: {

        direct: function (val) {
            this.$router.push({ path: '/' + val });
        },
        //调取会员列表
        getVipList: function () {
            var userToken = localStorage.getItem('tokens')
            var that = this
            axios({
                url: domains + '/f/agent/home/memberList?token=' + userToken,
                method: 'post',
                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                //data: Qs.stringify(postDo)
            }).then(res => { that.listsucc(res) }).catch(err => { that.listerr(err) })
        },
        //调取会员列表成功
        listsucc: function (res) {
            // console.log(res)
            this.list = res.data.data

        },
        listerr: function (err) {
            console.log(err)
        }

    }
}
</script>

<style lang='stylus' scoped>
.com-cnt {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 99;
    background: #ffffff;

    ul {
        border-bottom: 1px solid #dddddd;
        font-size: 12px;
        overflow: hidden;

        li {
            border-right: 1px solid #dddddd;
            float: left;
            width: 33.3333333%;
            height: 44px;
            line-height: 44px;
            text-align: center;

            .headimg {
                width: 31px;
                height: 31px;
                border-radius: 100%;
                background: #ccc;
                display: inline-block;
                vertical-align: middle;

                img {
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }

    .hadbottom {
        height: 60px;
        line-height: 60px;
        font-size: 12px;
        color: #999999;
        text-align: center;
    }
}
</style>
